<template>
  <div>
 <Search @serch="serch">
</Search>
<div id="content">
   <van-row>
    <van-col span="6" v-for="(item,index) in data" :key="index">
    <router-link  :to="{path: '/about',query: { url: item.url, num: item.num } }"  @click.native="selectList(item)">
      <div class="list">
      <div class="img_box">
       <img :src="item.cover" />
      </div>
      <div>
        <p class="tit">{{tit[index]}}</p>
        <p class="zj">{{item.author}}</p>
      </div>
     </div>
    </router-link>
    </van-col>
   </van-row>
   </div>
  </div>
</template>

<script>
import { mhSerchApi } from '../../api/data';
import { mapState,mapMutations } from 'vuex';
import Search from '../Moudule/Search.vue'
export default {
  components: { Search},
 name:"list",
 data()
 {
   return{
    data:[],
    tit:[],
    allList:[],
    page:{
      pageSize:20,
      pageNo:1,
    }
   }  
 },
 methods:{
   ...mapMutations(['setMhData']),
  serch(list)
  {
    this.data = []
    this.data = list
    this.tit = list.map((v) => (v.tit = v.title.length > 10 ? v.title.substring(0, 10)+".." : v.title))
    console.log(this.data)
  },
     selectList(item) {
      this.setMhData(item);
      sessionStorage.setItem("mhItem",JSON.stringify(item));
    },
 },
 provide()
 {
    return 
    {
        getHomeData:this.getHomeData
    }
 }
}
</script>

<style lang="less" scoped>
@import url('./list.less');
</style>